<?php if (isset($this->friends)): ?>
<style type="text/css">                              
#global_content_simple {width: 100%; overflow: visible;}
#global_content_simple .friends {width: 100%;}
</style>
<div class="friends">
    <div class="top_bar">
        <div class="search_box">
            <a href="javascript:void(0);" class="fb_add fb_btn"><?php echo $this->translate('Search by Name');?></a>
            <input type="text" id="search_name" class="search_name" />
            <a href="javascript:void(0)" class="aclose" onclick="$('search_name').value = ''; iSearch('');"><i class="iClose"></i></a>
        </div>
    </div>
    <form id="frm_ask_friends" action="<?php echo $this->url(array('controller' => 'poll', 'action' => 'ask-friends'), 'poll_general', true);?>" method="post">
    <div class="middle_content"> 
    <ul id="my_friends">
    <?php $userApi = Engine_Api::_()->user();?>
    <?php foreach ($this->friends as $item): ?>
        <?php $friend = $userApi->getUser($item->user_id);?>
        <li title="<?php echo $friend->getTitle();?>">
            <div class="friend_identity">
                <input type="checkbox" value="<?php echo $friend->getIdentity();?>" class="isFriend" name="friends[]">
                <span class="img_icon"><?php echo $this->itemPhoto($friend);?></span>
            </div>            
            <div class="friend_title"><?php echo $friend->getTitle();?></div>
        </li>
    <?php endforeach; ?>
    </ul>
    </div>
    <div class="bottom_bar">
        <div class="bar_button">
            <button class="fb_confirm fb_btn" type="submit"><?php echo $this->translate('Submit');?></button>
            <a href="" class="fb_add fb_btn" style="padding: 4px;" onclick="parent.Smoothbox.close();"><?php echo $this->translate('Cancel');?></a>
        </div>
    </div>
    <input type="hidden" name="poll" value="<?php echo $this->question->getIdentity();?>" />
    </form>
</div>
<script type="text/javascript">
var iChoose = function($li) {
    $input = $li.getChildren('input').getLast();
        $checked   = $input.checked;
        if ($checked == true) {
            $li.removeClass('active');                       
        } else {
            $li.addClass('active');    
        }
        $input.checked = $checked ? false : true;
}
var iSearch = function($key) {
    $('my_friends').getChildren('li').each(function($li){
        $title = $li.get('title');
        if ($key == '') {$li.removeClass('hide'); return false;}
        if ($title.search(eval('/'+$key+'/i')) == -1) $li.addClass('hide');
        else $li.removeClass('hide');
    });    
}
window.addEvent('domready', function(){
    $('my_friends').getChildren('li').each(function($li){
        $li.addEvent('click', function(){            
            iChoose($(this));    
        });
    });
    $$('.isFriend').each(function($el){
        $el.addEvent('click', function(){            
            iChoose($(this).getParent('li'));    
        });
    });
    $('search_name').addEvent('keyup', function(){
        console.log('as');
        iSearch($(this).value);   
    });
});
</script>
<?php endif;?>